<template>
    <div>
      <!-- 导航栏 -->
      <van-nav-bar left-arrow @click-left="onClickLeft">
        <template #title>
            <span>增加地址</span>
        </template>
      </van-nav-bar>

      <van-address-edit
        :area-list="areaList"
        show-set-default
        show-search-result
        :search-result="searchResult"
        :area-columns-placeholder="['请选择', '请选择', '请选择']"
        @save="onSave"
        @change-detail="onChangeDetail"
      />
    </div>
</template>

<script>
import { Toast } from 'vant';
import { areaList } from '@vant/area-data';
import axios from 'axios'
export default {
  data() {
    return {
      areaList,
      searchResult: [],
    };
  },
  methods: {
    onClickLeft(){
      // 后退一步
      this.$router.go(-1);
    },
    onSave(address) {
      address.isDefault = address.isDefault ? 1 : 0;
      this.$set(address,"uid",this.$store.state.uid)
      console.log(JSON.stringify(address));
      // axios.defaults.headers['Content-type'] = 'application/x-www-form-urlencoded;charset=utf-8';
      axios.post('http://localhost:9090/api/insertAddress',{
          address:JSON.stringify(address)
        })        
        .then(res => {    
          // 处理响应数据
          if (res.data.code === 200) {
            Toast('增加成功');
            this.$router.go(-1)
          }else{
            Toast('增加失败');
          }
        })        
        .catch(err => {   
            console.log(err.data)        
        }) 
      
    },
    onChangeDetail(val) {
      if (val) {
        this.searchResult = [
          {
            name: '黄龙万科中心',
            address: '杭州市西湖区',
          },
        ];
      } else {
        this.searchResult = [];
      }
    },
  },
};
</script>

<style>

</style>